// 搜索时发生的事件
$(".txt1").on("focus",function(){
	$(".pp1").show();
})
$(".txt1").on("blur",function(){
	$(".pp1").hide();
})


// ajax请求
// 省市二级联动
var baseURL = "http://localhost:8888";
$.get(baseURL+"/city",function(data){
	var data1 = data['城市代码'];
    for (var i = 0; i < data1.length; i++) {
    	$("<option></option>").appendTo(".sou .aa").html(data1[i]["省"]).val(i);
    };
    var num;
    $(".sou .aa").on("change",function(){
    	num = $(this).val();
    	$(".sou .bb>option").eq(0).siblings().remove();
    	for(var j = 0; j < data1[num]["市"].length; j++){
            $("<option></option>").appendTo(".sou .bb").html(data1[num]["市"][j]['市名']);
    	}
    })
});


// 左侧数据栏头部
$(".btn3 li").click(function(){
	$(this).attr("class","teshu").siblings("li").attr("class","");
})


// 获取页面数据
var num2 = 0;
function shuju(k){
    $.get(baseURL+"/6",function(data){ 
        var data = data["shop_data"];
        // console.log(data);
        // 判断数据是从第几项开始的,因为提供的数据一页有十项,而页面一页只需要五项
        if(k % 3 == 0){
            var a = 0;
            var b = 10;
        }else if(k % 3 == 1){
            var a = 10;
            var b = 20;
        }else{
            var a = 20;
            var b = 30;
        }
        // 渲染页面
        for(let i = a; i < b; i++){
            var div = $("<div></div>").appendTo('.zuo .shuJu').attr("class","tiao");
            var p1 = $("<p></p>").appendTo(div);
            var img1 = $("<img/>").appendTo(p1).attr("src",data[i]["shop_ico"]);
            var ul1 = $("<ul></ul>").appendTo(div).attr("class","ul1");
            var li1 = $("<li></li>").appendTo(ul1).html("店铺等级:"+data[i]["level"]);
            var a1 = $("<a href='#'></a>").prependTo(li1).html(data[i]["shop_name"]);
            var li2 = $("<li></li>").appendTo(ul1).html("主营："+data[i]["main"]);
            var li3 = $("<li></li>").appendTo(ul1).html("地址："+data[i]["addr_detail"]);
            var ul2 = $("<ul></ul>").appendTo(div).attr("class","ul2");
            var li4 = $("<li></li>").appendTo(ul2).html(" 先行赔付");
            var img2 = $("<img src='../img/a27.png'/>").prependTo(li4);
            var li5 = $("<li></li>").appendTo(ul2).html(" 同城帮认证");
            var img2 = $("<img src='../img/a28.png'/>").prependTo(li5);
            var li6 = $("<li></li>").appendTo(ul2).html("人气："+data[i]['shop_visit']+"次浏览");
        }
        $(".shuJu .tiao").eq(9).css("border","none");
        $(".shuJu .tiao").on("mouseenter",function(){
            $("<button></button>").appendTo($(this)).html("进入店铺");
            $(this).css("background","#f6f6f6");
        })
        $(".shuJu .tiao").on("mouseleave",function(){
            $(".tiao button").remove();
            $(this).css("background","white");
        })
    })
}
shuju(num2);

// 切换数据的按钮
$(".btn4 li").on("click",function(){
    num2 = $(this).index();
    $(".shuJu .tiao").remove();
    $(this).attr("class","orange").siblings().attr("class","");
    shuju(num2);
})
$(".btn4 p").on("click",function(){
    num2++;
    if(num2<3){
        $(".shuJu .tiao").remove();
        $(".btn4 li").eq(num2).attr("class","orange").siblings().attr("class","");
        shuju(num2);
    }else{
        alert("已经没有数据!!!")
    }   
})


// 数据排行
function shuju2(){
    $.get(baseURL+"/6",function(data){
        var data2 = data["shop_data"];
        // 按评论条数截取数据
        data2 = data2.sort(compare("comments")).slice(0,10);
        console.log(data2)
        // 渲染页面2
        for(let t = 0; t < data2.length; t++){
            var div2 = $("<div/>").appendTo($(".you .ww")).attr("class","tiao2");
            var xx1 = $("<div/>").appendTo(div2).attr("class","xx1").html(1+t);
            var xx2 = $("<div/>").appendTo(div2).attr("class","xx2");
            var imgg = $("<img/>").appendTo(xx2).attr("src",data2[t]["shop_ico"]);
            var xx3 = $("<div/>").appendTo(div2).attr("class","xx3");
            var aa1 = $("<a href='#'></a>").appendTo(xx3).html(data2[t]["shop_name"]);
            var pp1 = $("<p/>").appendTo(xx3).html(data2[t]["comments"]+"条评论");
        }
        for(let e = 0; e < 3; e++){
            $(".xx1").eq(e).css({borderColor:"#fc6621",color:"#fc6621"});
        }
    })
} 
shuju2()

// 对象排序函数
var compare = function (prop){
    return function(obj1,obj2){
        var val1 = obj1[prop];
        var val2 = obj2[prop];
        if(!isNaN(Number(val1)) && !isNaN(Number(val2))){
            val1 = Number(val1);
            val2 = Number(val2);
        }
        if(val1 < val2){
            return 1;
        }else if(val1 > val2){
            return -1;
        }else{
            return 0;
        }
    }
}

// 回到顶部
function db(){
    document.onscroll = function(){
        var scrollTop = document.body.scrollTop + document.documentElement.scrollTop;
        if(scrollTop>30){
            $(".hddb").show();
        }else{
            $(".hddb").hide();
        }
    }
    $(".hddb").on("click",function(){
        document.body.scrollTop = 0;
    })
}
db();